<template>
	<view>
        <view class="box">
        	<view class="box_title">
        		<text>安徽安驶机动车检测有限责任公司</text>
        	</view>
			<view class="tag d-flex a-center">
				<text class="tag_a" >安</text>
				<text class="tag_b">自营</text>
				<view class="ml-auto">
					已售0
				</view>
			</view>
			<view class="mt-2">
				<image style="width: 240rpx;height: 180rpx; border-radius: 15rpx;" src="../../../static/home/013.png" mode=""></image>
			</view>
			<view class="data_mid">
				<view class="mid_title d-flex a-center">
					<image class="img mr-1" src="../../../static/home/016.png" mode=""></image>
					<text>安徽省合肥市蜀山区小庙镇安徽津利邦</text>
				</view>
				<view class="mid_txt">
					距你16km
				</view>
				<image class="img2" src="../../../static/home/018.png" mode=""></image>
			</view>
			
         <view  class="data-buton mt-2">
	        <view class="left">
	        	<image class="img" src="../../../static/home/015.png" mode=""></image>
				<text class="ml-2">预约车检</text>
	        </view>
			<view @click="payMethods" class="left">
				<image class="img" src="../../../static/home/017.png" mode=""></image>
				<text class="ml-2">去买单</text>
			</view>
         </view>	
        </view>
		<view class="data-footer">
			<view class="row d-flex a-center pl-2">
				<text class="row_h mr-2"></text>
				<text class="font-md font-weight">站点信息</text>
			</view>
			<view class="rows">
				<text class="rows_txt">营业时间:</text>
				<text >08:00:00-17:00:00</text>
			</view>
			<view class="rows">
				<text class="rows_txt">站点简介:</text>
				<text >机动车检测</text>
			</view>
		</view>
		
		
		
	</view>
</template>

<script>
	export default {
		data(){
			return{
				show:true,
			}
		},
		onLoad() {
			
		},
		methods:{
			payMethods(){
				uni.navigateTo({
					url:'./payBill'
				})
			}
		}
	}
</script>

<style lang="scss">
	page{
		background: #F2F5FA;
	}
	
   .box{
	 padding: 20rpx 15rpx;
	 width: 100%;
	 background: #FFFFFF;
	 .tag{
		.tag_a{
			display: flex;
			align-items: center;
			border-radius: 8rpx;
			background: #E79B4D;
			font-size: 20rpx;
			color: #FFFFFF;
			padding: 0 8rpx;
			align-items: center;
			
		} 
		.tag_b{
			display: block;
			border: 1px solid #7A9CEA;
			color: #7A9CEA ;
			font-size: 20rpx;
			padding: 0 10rpx;
			border-radius: 10rpx;
			margin-left: 10rpx;
		}
	 }
	 .data-buton{
		 width: 100%;
		 display: flex;
		 justify-content: space-between;
		 align-items: center;
		 .left{
			 width: 330rpx;
			 height: 90rpx;
			 font-size: 25rpx;
			 display: flex;
			
			 align-items: center;
			 justify-content: center;
			 border-radius:10rpx;
			 box-shadow: 0px 1px 22px 0px rgba(4, 0, 0, 0.08);
			 .img{
				width: 38rpx;
				height: 38rpx;
			 }
			 
		 }
	 }
	 
	 .box_title{
		 font-size: 35rpx;
		 font-weight: bold;
	 }
	 .data_mid{
		 width: 100%;
		 height: 90rpx;
		 position: relative;
		 .img2{
			 width: 42rpx;
			 height: 42rpx;
			 position: absolute;
			 top:15rpx;
			 right: 10rpx;
		 }
		 .mid_txt{
			 width: 650rpx;
			 color: #7F7F7F;
			 font-size: 25rpx;
			 margin-left: 40rpx;
		 }
		 .mid_title{
			 width: 650rpx;
			 .img{
				 width: 28rpx;
				 height: 28rpx;
			 }
		 }
	 }
   }
   
   .data-footer{
	   background: #FFFFFF;
	   margin-top: 30rpx;
	   .row{
		   .row_h{
			   height: 40rpx;
			   border: 1px solid #2170F1;
		   }
		   height: 100rpx;
		   border-bottom: 1px solid #f5f6f7;
	   }
	   .rows{
		   display: flex;
		   align-items: center;
		 
		   padding-left: 20rpx;
		   height: 80rpx;
		   width: 100%;
		   .rows_txt{
			   font-size: 28rpx;
			   margin-right: 20rpx;
			     font-weight: bold;
		   }
	   }
   }
</style>
